<script setup>
import AsideLeft from "./pages/AsideLeft.vue";
import AsideRight from "./pages/AsideRight.vue";
</script>

<template>
  <!-- 广告 -->
  <div class="advertisement">
    <h1>您没猜错，这是一个广告位</h1>
  </div>
  <div class="all">
    <!-- 左侧 -->
    <AsideLeft></AsideLeft>
    <!-- 右侧 -->
    <AsideRight>
      <!-- 路由出口 -->
      <RouterView />
    </AsideRight>
  </div>
</template>

<style>
* {
  margin: 0;
  padding: 0;
}
.advertisement {
  width: 100vw;
  height: 20vh;
  background-color: rgb(241, 118, 118);
  text-align: center;
  align-content: center;
}
.all {
  width: 100vw;
  height: 78vh;
  display: flex;
  /* background-color: rgba(255, 0, 0, 0.443); */
}
</style>
